// pages/userinfo/userinfo.js
const http = require("../../utils/http")
const api = require("../../comm/api")

import Notify from "../../components/@vant/weapp/notify/notify"

Page({

  /**
   * 页面的初始数据
   */
  data: {
    fileList: [],
    user: null,
    isloading: false
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    // 加载登录用户的个人信息
    this.loadUserInfo()
  },

  /**
   * 加载登录用户的个人信息
   */
  loadUserInfo: function () {
    // 通过令牌获取登录用户的个人信息
    http.getJSONWithToken(api.User.Info.PATH, pojo => {
      // 读取到个人信息
      const user = pojo.data
      this.setData({
        user: user,
      })
      // 如果用户不为空，
      // 则在此处开始构造van-uploader所需的数据格式
      if (!!user.avatar) {  // 如果头像不为空，则显示头像
        // 构造一个图片元素
        const image = {
          url: api.HOST + user.avatar,
          avatar: user.avatar,
          name: '头像',
          isImage: true,
          deletable: true,
          status: 'done',
          message: '',
        }
        // 把一个图片元素给van-uploader节点
        this.setData({
          'fileList[0]': image
        })
      }
    }, err => {
      // 没有获取到个人信息，则错误提示
      Notify({
        type: 'warning',
        message: JSON.stringify(err)
      })
    })
  },

  /**
   * 头像上传事件处理方法
   * @param {*} e 事件对象 e.detail.file.url为选择的图片地址
   */
  uploadAvatar: function (e) {
    // 获取头像图片地址
    const avatar = e.detail.file.url
    // 构造一个van-uploader所需数据节点用于显示状态
    const image = {
      url: avatar,
      name: '头像',
      isImage: true,
      deletable: true,
      // 设置组件状态为上传中
      status: 'uploading',
      message: '上传中',
    }
    this.setData({
      'fileList[0]': image
    })
    // 开始上传所选上传图片
    http.uploadFile(api.Upload.PATH, avatar, pojo => {
      // 根据上传成功后返回的图片地址，修正到van-uploader节点
      // 用于存储头像文件名（不包含服务器地址）
      image.avatar = pojo.data
      // 设置组件状态为已经上传成功
      image.status = 'done'
      image.message = '上传成功'
      this.setData({
        'fileList[0]': image
      })
    }, err => {
      image.status = 'failed'
      image.message = '上传失败'
      // 提示上传失败
      Notify({
        type: "danger",
        message: JSON.stringify(err)
      })
    })
  },

  /**
   * van-uploader组件删除图片事件的方法
   * @param {*} e 事件参数
   */
  removeAvatar: function (e) {  // 删除头像
    // 设置组件显示内容为空
    this.setData({
      fileList: []
    })
  },

  /**
   * 表单提交事件处理方法
   * @param {*} e 提交事件参数，e.detail.value为提交的内容
   */
  onSubmit: function (e) {
    // 获取表单提交参数
    const params = e.detail.value
    // 昵称必填，此处检查昵称是否填写
    if (!params.nickName) {
      // 昵称没有填写，提示错误，然后退出提交
      this.setData({
        error_nickName: '昵称不能为空'
      })
      return
    }
    // 获取选择的图片地址
    const image = this.data.fileList[0]
    if (!!image && !!image.avatar) { 
      // 头像不为空，设置提交参数
      params['avatar'] = image.avatar
    }
    // 删除多余数据
    delete params["1"]
    delete params["0"]
    // 设置提交按钮为正在上传状态
    this.setData({
      isloading: true
    })
    // 开始提交个人信息修改
    http.putJSONWithToken(api.User.Update.PATH, params, pojo => {
      // 上传成功，显示更新成功，延时1秒后，返回上一页
      Notify({
        type: 'success',
        message: '更新成功',
        duration: 1000,
        onClose:  () => {
          wx.navigateBack({
            delta: 0,
          })
        }
      })
    }, err => {
      // 提交失败，提示错误类型
      Notify({
        type: 'warning',
        message: JSON.stringify(err),
      })
      // 回复按钮可提交状态
      this.setData({
        isloading: false
      })
    })
  }
})